<%@page language="java" contentType="text/html;chartset=UTF-8" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>抽奖系统</title>
    <link rel="stylesheet" href="css/luck_draw.css" media="screen" type="text/css">
</head>
<body>
<div class="container none"></div>
<div class="mask"></div>
<div id="stop" class="btn_circle none">停止</div>
<div class="lucky_title">抽奖系统</div>
<div class="loader_file">
    用户数据导入中 <span class="current_number"></span><span class="all_number"></span>
</div>
<div class="lucky_list clearfix">
    <div class="left lucky_prize">
        <div class="lucky_prize_box">
            <button class="lucky_prize_left lucky_prize_direction"><</button>
            <div data-default="1" class="lucky_prize_picture">
                <c:forEach items="${drawList}" var="draw" varStatus="vs">

                    <img class="lucky_prize_show none"
                         <c:choose>
                         <c:when test="${vs.index==0}">
                             src="images/bXshiKc7Z2mQusImhSzC33czcBci3K.png"
                         </c:when>
                         <c:when test="${vs.index==1}">
                             src="images/szSy9dU21WZnSdGwP9tE533ntEd1WE.png"
                         </c:when>
                         <c:when test="${vs.index==2}">
                             src="images/gLz4H2xZ8XxkXlDDGdd8Fd2xF35kjX.png"
                         </c:when>
                         <c:otherwise>
                             src="images/12345.jpg"
                         </c:otherwise>
                         </c:choose>
                         id="${draw.id}"
                         alt="${draw.drawName}${draw.prizeName}"/>
                </c:forEach>
                <!--
                <img class="lucky_prize_show none"
                     src="images/bXshiKc7Z2mQusImhSzC33czcBci3K.png"
                     alt="一等奖笔记本"/>
                <img class="none lucky_prize_show"
                     src="images/szSy9dU21WZnSdGwP9tE533ntEd1WE.png"
                     alt="二等奖平衡车"/>
                <img class="none lucky_prize_show"
                     src="images/gLz4H2xZ8XxkXlDDGdd8Fd2xF35kjX.png"
                     alt="三等奖现金红包"/>
                     -->
            </div>
            <button class="lucky_prize_right active lucky_prize_direction">></button>
        </div>
        <div class="lucky_prize_title">${drawList[0].drawName}${drawList[0].prizeName}</div>
        <input type="hidden" id="drawId" name="drawId" value="${drawList[0].id}"/>
        <div class="lucky_setting">
            <span>
                <b class="lucky_number">${phoneCount}</b>
                人参与
            </span>

            <div class="select_box">
                一次抽
                <select name="select_lucky_number" class='select_lucky_number'>
                    <option selected = "selected" value="1">1</option>
                    <option value="2">2</option>
                    <option value="3">3</option>
                    <option value="4">4</option>
                    <option value="5">5</option>
                    <option value="10">10</option>
                    <option value="20">20</option>
                    <option value="30">30</option>
                </select>
                人
            </div>
        </div>
        <div id="open" class="btn_circle btn_start">开始</div>
    </div>
    <div class="right lucky_people_list">
        <div class="lucky_people_title">中奖名单</div>
        <c:forEach items="${drawList}" var="draw" varStatus="vs">
            <div class="lpl_list clearfix none">

            </div>
        </c:forEach>
        <!--
        <div class="lpl_list clearfix none">

        </div>
        <div class="lpl_list clearfix none">

        </div>
        <div class="lpl_list clearfix none">

        </div>-->
    </div>
</div>


<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src='js/transform.js'></script>
<script type="text/javascript" src='js/tick.js'></script>
<!--data为静态数据 如用ajax获取请取消输入引入-->
<!--抽奖动画-->
<script type="text/javascript" src='js/3d.js'></script>
<!--实际抽奖逻辑代码-->
<script type="text/javascript" src='js/lucky.js'></script>
<!-- ajax抽奖逻辑 -->
<jsp:include page="/js/data.jsp"/>
<!--
<script type="text/javascript" src="js/data.jsp"></script>
-->
</body>
</html>